import { ReactElement } from 'react'
import style from './index.module.less'
import { PerformanceSchema } from '@components/schema/performanceSchema'
import { formatDate } from '@js/tool'

function renderTime (data: PerformanceSchema | null): string {
  if (data === null) {
    return '--'
  }
  const begin = formatDate(data.begin_datetime, 'YYYY年MM月DD日')
  const end = formatDate(data.end_datetime, 'YYYY年MM月DD日')
  return `${begin}至${end}`
}

function renderValue (data: PerformanceSchema | null, k: keyof PerformanceSchema, isFixed: boolean = false): string {
  if (data === null) {
    return '--'
  }
  const v: any = data[k]
  if (v === null || v === undefined) {
    return '--'
  }
  if (typeof v === 'number' && isFixed) {
    return v.toFixed(2)
  }
  return v
}

interface Props {
  data: PerformanceSchema | null
}

function Main ({ data }: Props): ReactElement {
  return (
    <div className={style.container}>
      <div className={style.cell}>
        <div className={style.label}>考核时间</div>
        <div className={style.value}>{renderTime(data)}</div>
      </div>
      <div className={style.cell}>
        <div className={style.label}>考核进度</div>
        <div className={style.value}>{ renderValue(data, 'status') }</div>
      </div>
      <div className={style.cell}>
        <div className={style.label}>负责人</div>
        <div className={style.value}>{ renderValue(data, 'principal') }</div>
      </div>
      {/* <div className={style.cell}>
        <div className={style.label}>平均分</div>
        <div className={style.value}>{ renderValue(data, 'accepter_average_score', true) }</div>
      </div> */}
    </div>
  )
}

export default Main
